<template>
	<div @touchstart="checkTouchStart" style="height: 10rem;" v-if="couponsdata" ref="mScroll">
		<banner style="width:100%; height: 100%; position:relative;">
			<ul class="scroller_list cate_list" style="padding: 10px 0 15px 15px;position: absolute;display:block;width:34.5rem;">
				<li v-for="(val,index) in couponsdata" :key="index" style="height:100%;" @click='jumpEvent(val)'>
					领取优惠券
				</li>
				<!--<div class="see_more" style="padding: 0;">
					<router-link tag="div" :to="" style="width: 100%;height: 100%"><img src="static/image/slide.png" style="height: 100%;width: auto"></router-link>
				</div>-->
			</ul>
		</banner>
	</div>
</template>

<script>
	import { mapMutations } from "vuex";
	import Banner from '../BannerScroll';
	export default {
		props: {
			couponsdata: {
				type: Array,
				default: () => []
			},
		},
		data() {
			return {
				
			}
		},
		components: {
			Banner
		},
		computed: {
			
		},
		methods: {
			...mapMutations('xxy', [
				"setstoptouch"
			]),
			jumpEvent(item) {
				// 跳到优惠券
				/*this.$router.push({
					path: 'detail?code=' + (item.goodsNo || item.goodscode)
				})*/
			},
			checkTouchStart(e) {
				this.setstoptouch(false)
				this.touchStartObj = {
					pageX: e.touches[0].pageX,
					pageY: e.touches[0].pageY
				}
			},
		},
		created() {

		},
		mounted() {
			
		}
	}
</script>

<style>
	.see_more {
		width: 13vw!important;
		/*border-radius: 0 !important;*/
		/*	position: absolute;*/
		padding-left: 10px;
		margin-right: 0.5rem;
	}
	
	.scroller_list .see_more {
		height: 6rem;
		float: right !important;
		writing-mode: unset;
	}
	
	.iscroll_list {
		height: 10rem;
	}
	
	.scroller_list li {
		width: 5rem;
	}
	
	.scroller_list li img {
		height: 4.5rem;
		width: 4.5rem;
	}
</style>